<template>
	<view class="beijing1">
		<view class="" style="position: fixed; top: 0">
			<image src="/static/beitu.png" mode="" style="width: 100vw; height: 100vh"></image>
		</view>
		<view class="" style="position: fixed; bottom: 0; right: 0">
			<image src="/static/zhang.png" mode="" style="width: 374rpx; height: 640rpx"></image>
		</view>
		<u-navbar :placeholder="true" title="个人信息" @rightClick="rightClick" :autoBack="true" bg-color="transparent"></u-navbar>
		<view class="beijing" style="position: relative; z-index: 1">
			<view class="" style="background: #ffffff; border-radius: 15rpx">
				<view class="" style="padding: 40rpx">
					<view class="between">
						<text class="shrink" style="font-weight: 400; font-size: 28rpx; color: #888888">头像</text>
						<view class="" style="position: relative;width: 66rpx; height: 66rpx;flex: 1;display: flex;justify-content: flex-end">
							<image :src="img + shujv.avatar" mode="" style="width: 66rpx; height: 66rpx; border-radius: 50%"></image>
							<button open-type="chooseAvatar" @chooseavatar="touxiang1" style="position: absolute; width: 100%; height: 100%; top: 0; opacity: 0">123</button>
						</view>
					</view>
					<view class="" style="padding: 30rpx 0">
						<u-line></u-line>
					</view>
					<view class="between">
						<text class="shrink" style="font-weight: 400; font-size: 28rpx; color: #888888">昵称</text>
						<u--input type="nickname" placeholder="请输入内容" border="0" v-model="shujv.nick" @blur="change1" inputAlign="right"></u--input>
					</view>
				</view>
			</view>
		</view>
		<view class="" style="height: 110rpx"></view>
		<view class="" style="position: fixed; bottom: 0; width: 100%">
			<view class="" style="padding: 0 25rpx">
				<view class="center" style="height: 90rpx; background: #6e0c00; border-radius: 50rpx" @click="quserupdateUser">
					<view class="" style="font-weight: 400; font-size: 30rpx; color: #ffffff; line-height: 0">保存修改</view>
				</view>
			</view>
			<view class="" style="height: env(safe-area-inset-bottom)"></view>
		</view>
	</view>
</template>

<script>
import { usergetUserInfo, userupdateUser } from '../../untils/api.js';
export default {
	data() {
		return {
			shujv: {}
		};
	},
	onLoad(ops) {
		this.qusergetUserInfo();
	},
	onShow() {},
	methods: {
		async quserupdateUser() {
			const data = await userupdateUser(this.shujv);
			if (data.code == 1) {
				uni.showToast({
					icon: 'none',
					title: '操作成功',
					duration: 2000
				});
				setTimeout(() => {
					uni.navigateBack({
						delta: 1
					});
				}, 1000);
			}
		},
		async qusergetUserInfo() {
			const data = await usergetUserInfo();
			this.shujv = data.data;
		},
		rightClick() {
			console.log('rightClick');
		},
		leftClick() {
			console.log('leftClick');
		},
		scrolltolower() {
			console.log('到底了');
		},
		change1(e) {
			console.log(e);
			this.shujv.nickname = e;
		},
		touxiang1(e) {
			console.log(e);
			uni.uploadFile({
				url: this.$imgurl + '/api/' + 'common.common/upload', //图片上传路径
				filePath: e.detail.avatarUrl,
				name: 'file',
				header: {
					token: uni.getStorageSync('token')
				},
				success: (uploadFileRes) => {
					console.log(uploadFileRes);
					const data = JSON.parse(uploadFileRes.data).data.path;
					this.shujv.avatar = data;
				},
				fail: (err) => {
					console.log(err);
				}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.sl1 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 1;
}
.sl2 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	-webkit-line-clamp: 2;
}
.beijing {
	overflow: hidden;
	padding: 0 25rpx;
}
.beijing1 {
	min-height: 100vh;
	background-color: #f0e8dc;
	//系统tabbar不要加注释掉
	padding-bottom: env(safe-area-inset-bottom);
	box-sizing: border-box;
}
</style>
